<template>
  <layout id="app" :appHeader="{title: '产品文档'}">
    <div id="pdf"></div>
  </layout>
</template>
<script>
import Pdfh5 from "pdfh5";
import "pdfh5/css/pdfh5.css";
export default {
  name: 'App',
  data() {
    return {
      pdfh5: null,
      resourceKey: ''
    };
  },
  onLoad(options) {
    this.resourceKey = options.resourceKey
    this.getDownloadLink()
  },
  methods: {
    getDownloadLink() {
      uni.$co.Fun.showLoading();
      uni.$API.Training.getPrivateDownloadLink(this.resourceKey).then((res) => {
        uni.request({
          url: res.data.url,
          method: 'get',
          responseType: "arraybuffer",
        }).then(res => {
          const href = window.URL.createObjectURL(
            new Blob([res[1].data], { type: "application/pdf" })
          );
          this.pdfh5 = new Pdfh5("#pdf", {
            data: res[1].data
          });
          this.pdfh5.on("complete", function (status, msg, time) {
            uni.$co.Fun.hideLoading();
            console.log("状态：" + status + "，信息：" + msg + "，耗时：" + time + "毫秒，总页数：" + this.totalNum)
          })
          this.pdfh5.on("render", function (currentNum, time, currentPageDom) {
            console.log(currentPageDom)
            console.log('......................')
          })
        })
      });
    }
  }
}
</script>

<style lang="scss">
* {
  padding: 0;
  margin: 0;
}
html,
body,
#app {
  width: 100%;
  height: 100vh;
}
#pdf {
  height: 100vh;
}
</style>